<template>
  <a href="#mobile-menu" id="menu-toggle-trigger" class="menu-trigger "> <i class="fa fa-bars"
                                                                            style="color: rgb(255, 255, 255);"></i></a>
  <div id="karma-mobile-wrapper">
    <ul id="mobile-menu" class="karma-mobile-nav">
      <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children">
        <a href="javascript:void(0)">技术</a>
        <ul class="sub-menu">
          <li class="menu-item menu-item-type-post_type menu-item-object-service">
            <router-link :to="{path:'/list/1'}">前端</router-link>
          </li>
          <li class="menu-item menu-item-type-post_type menu-item-object-service">
            <router-link :to="{path:'/list/2'}">后端</router-link>
          </li>
          <li class="menu-item menu-item-type-post_type menu-item-object-service">
            <router-link :to="{path:'/list/3'}">数据库</router-link>
          </li>
        </ul>
      </li>
      <li class="menu-item menu-item-type-post_type menu-item-object-service">
        <router-link :to="{path:'/list/4'}">电影</router-link>
      </li>

      <li v-show="JSON.stringify(user) !== '{}'"
          class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children">
        <a href="javascript:void(0)">{{ user.username }}(积分:{{ user.point }})</a>
        <ul class="sub-menu">
          <li class="menu-item menu-item-type-post_type menu-item-object-service">
            <a href="javascript:void(0);" @click.prevent="logout">登出</a>
          </li>
        </ul>
      </li>
      <li v-show="JSON.stringify(user) === '{}'" class="menu-item menu-item-type-post_type menu-item-object-service">
        <a href="#login">登录</a>
      </li>
    </ul>
    <a href="#mobile-menu" id="menu-panel-close" class="menu-trigger">
      <img src="https://assets.yanghaha.vip/static/images/xmobile-menu-close.png"/>
    </a>
  </div>
</template>

<script>
import BaseService from "@/services/BaseService";
const BaseServiceApi = new BaseService();
export default {
  name: "Header",
  data: function () {
    return {}
  },
  props: {
    user: Object
  },
  mounted: function () {

  },
  methods: {
    logout: function () {
      BaseServiceApi.removeStorage("token");
      window.location.reload();
    }
  }
}
</script>

<style scoped>

</style>
